<template>
	<div class="warp" id="user_password">
		<el-row class="card">
			<el-col :span="24">
				<h1 class="text-center">
					修改密码
				</h1>
			</el-col>
			<el-col :span="24">
				<el-form ref="form" :model="form" label-width="100px">
					<el-row class="row_e">
						<el-col :xs="24" :sm="24" :xl="8" class="el_form_item_warp">
						<el-form-item label="原密码">
							<el-input type="password" v-model="form.o_password" :minlength="0" :maxlength="16"
								placeholder="请输入原密码" />
						</el-form-item>
					</el-col>

					<el-col :xs="24" :sm="12" :xl="8" class="el_form_item_warp">
						<el-form-item label="新密码">
							<el-input type="password" v-model="form.password" :minlength="0" :maxlength="16"
								placeholder="请输入原密码" />
						</el-form-item>
					</el-col>

					<el-col :xs="24" :sm="12" :xl="8" class="el_form_item_warp">
						<el-form-item label="请确认密码">
							<el-input type="password" v-model="confirm_password" :minlength="0" :maxlength="16"
								placeholder="请输入确认新密码" />
						</el-form-item>
					</el-col>
					</el-row>
					

					<el-col :xs="24" :sm="24" :xl="24" class="el_form_btn_warp">
						<el-col :xs="24" :sm="12" :lg="12" class="el_form_btn el_form_btn_1">
							<el-button style="width: 100%; float: left;" type="primary" @click="submit()">提交
							</el-button>
						</el-col>
						<el-col :xs="24" :sm="12" :lg="12" class="el_form_btn el_form_btn_2">
							<el-button style="width: 100%; float: right;" @click="cancel()">取消</el-button>
						</el-col>
					</el-col>
				</el-form>
			</el-col>
		</el-row>
	</div>
</template>


<script>
	import mixin from '@/mixins/page.js';

	export default {
		mixins: [mixin],
		components: {},
		data() {
			return {
				url_submit: "~/api/user/change_password?",
				field: "user_id",
				query: {},
				form: {
					"o_password": "",
					"password": '',
				},
				confirm_password: ''
			}
		},
		methods: {
			get_form() {
				var _this = this;
				this.$get(this.url_get_obj, null, function(res) {
					if (res.result && res.result.obj) {
						$.push(_this.form, res.result.obj);
					}
				});
			},
			submit_before(param){
				var p = Object.assign({},param);
				return p;
			},
			submit_check(param) {
        if(!this.form.password){
          return "密码不能为空!";
        }
        if(this.form.password.length > 16 || this.form.password.length < 5){
          return "密码长度应为5到16个字符之间！";
        }
				if (this.form.password !== this.confirm_password) {
					return "密码和确认密码不一致！"
				}
				return null;
			},
			submit_after(res, status) {
				this.$store.commit("quit");
				this.$router.push("/login");
			}
		},
		created() {
			this.form.username = this.user.username;
			this.get_form();
		}
	}
</script>

<style scoped="scoped">
	#user_password .card {
		padding: 2rem 1rem;
	}

	#user_password .text-center {
		text-align: center;
	}
</style>
